<template>
<div class="pd10">
    <el-form ref="form" :model="form" label-width="80px">
        <el-form-item label="片名">
            <div style="width:217px;">
                <el-input v-model="form.name"></el-input>
            </div>
        </el-form-item>

  <insert-add-tag :windex="0" @upTagData="receiveTagData" wlabel='导演' wact="添加导演"></insert-add-tag>
  <insert-add-tag :windex="1" @upTagData="receiveTagData" wlabel='主角' wact="添加主角"></insert-add-tag>

        <el-form-item label="国家">
            <el-select multiple v-model="form.region" placeholder="电影产地">
                <el-option-group v-for="group in options" :key="group.label" :label="group.label">
                    <el-option v-for="item in group.options" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                </el-option-group>
            </el-select>

        </el-form-item>
        <el-form-item label="上映时间">
            <div style="width:217px;">
                <el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
            </div>
        </el-form-item>

        <el-form-item label="电影标签">
            <el-checkbox-group v-model="form.type">
                <el-checkbox label="动作" name="type"></el-checkbox>
                <el-checkbox label="警匪" name="type"></el-checkbox>
                <el-checkbox label="爱情" name="type"></el-checkbox>
                <el-checkbox label="悬疑" name="type"></el-checkbox>
                <el-checkbox label="惊悚" name="type"></el-checkbox>
            </el-checkbox-group>
        </el-form-item>

        <el-form-item label="备注">
            <el-input type="textarea" :autosize="{ minRows: 3, maxRows: 10}" placeholder="请输入备注" v-model="form.desc">
            </el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click="onSubmit">立即创建</el-button>
            <el-button>取消</el-button>
        </el-form-item>
    </el-form>
</div>
</template>

<script>

import InsertAddTag from '@/components/InsertAddTag.vue';
export default {
    components:{
        InsertAddTag
    },
    data() {
        return {

            options: [{
                label: '热门国家',
                options: [{
                    value: '1',
                    label: '美国'
                }, {
                    value: '2',
                    label: '中国'
                }]
            }, {
                label: '国家',
                options: [{
                    value: '3',
                    label: '印度'
                }, {
                    value: '4',
                    label: '英国'
                }, {
                    value: '5',
                    label: '法国'
                }, {
                    value: '6',
                    label: '其他'
                }]
            }],
            form: {
                name: '',
                region: '',
                date1: '',
                date2: '',
                director: '',
                type: [],
                desc: ''
            },
            directorTags: [],
            directorVisible: false,
            directorValue: ''
        }
    },
    mounted(){
        console.log('kanakn',this.$store.getters)
        this.$store.subscribe((mutation, state) => {
            console.log('阿萨德')
  console.log('需要',mutation.type)
  console.log('看来',state)
})
    },
    methods: {
     gg(){
         //this.$store.commit('toWar3',21)
         this.$store.commit('maCount')
     },
    ggb(){
         //this.$store.commit('toWar3',21)
         this.$store.dispatch('actyoxi')
     },
        onSubmit() {
            console.log('submit!', this.form);
        },
      receiveTagData(index,data){
            console.log('从子组件传递过来的值',index,data)
            this.directorTags[index]=data
            console.log('最终整合的二维数组',this.directorTags)
      }
    }
}
</script>

<style>
.el-tag+.el-tag {
    margin-left: 10px;
}

.button-new-tag {
    margin-left: 10px;
    height: 32px;
    line-height: 30px;
    padding-top: 0;
    padding-bottom: 0;
}

.input-new-tag {
    width: 90px;
    margin-left: 10px;
    vertical-align: bottom;
}
</style>
